<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="../include/taglib.jsp" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${ctx}/statics/js/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${ctx}/statics/css/pageCommon.css">
    <link rel="stylesheet" type="text/css" href="${ctx}/statics/js/ueditor/themes/default/css/ueditor.css">
    <style>
        .control-label {
            text-align: left;
            padding-left: 118px;
            padding-top: 7px;
        }

        @media screen and (max-width: 1560px) {
            .control-label {
                padding-left: 80px;
            }
        }
    </style>
</head>
<body>
<div class="col-md-8 col-md-offset-1">
    <div style="height: 30px;"></div>
    <form id="announcForm" name="announcForm">
        <div class="form-group clearfix">
            <label class="control-label col-md-3 inline"><span class="text-red">*</span>主题:</label>
            <div class="col-md-9">
                <input type="text" class="form-control" id="subject" name="title">
            </div>
        </div>
        <div class="form-group clearfix">
            <label class="control-label col-md-3 inline"><span class="text-red">*</span>发布时间:</label>
            <div class="col-md-3">
                <input type="text" class="form-control" id="releaseTime" name="insertDatetime">
            </div>

            <label class="control-label col-md-3 inline"><span class="text-red">*</span>有效期:</label>
            <div class="col-md-3">
                <input type="text" class="form-control" id="useLife" name="expiryDatetime">
            </div>
        </div>
        <div class="form-group clearfix">
            <label class="control-label col-md-3 inline"><span class="text-red">*</span>内容:</label>
            <div class="col-md-9">
                <!--style给定宽度可以影响编辑器的最终宽度-->
                <script type="text/plain" id="myEditor" style="width:100%;height:400px;" name="content">

                </script>
            </div>
        </div>
        <div class="form-group clearfix" style="text-align: center">
            <label class="control-label col-md-3 inline"></label>
            <div class="col-md-9">
                <a class="btn btn-primary" id="submit">发布</a>
                <a class="btn btn-primary" id="back">返回</a>
            </div>
        </div>
    </form>
</div>
<script src="${ctx}/statics/js/jQuery-2.2.0.min.js"></script>
<script src="${ctx}/statics/js/bootstrap/js/bootstrap.min.js"></script>
<script src="${ctx}/statics/js/bootstrap/js/common.js"></script>
<script src="${ctx}/statics/js/laydate/laydate.js"></script>
<!--include ueditor--->
<script src="${ctx}/statics/js/ueditor/ueditor.config.js"></script>
<script src="${ctx}/statics/js/ueditor/ueditor.all.js"></script>
<script src="${ctx}/statics/js/ueditor/lang/zh-cn/zh-cn.js"></script>
<script src="${ctx}/statics/js/ueditor/ueditor.parse.js"></script>
<script type="text/javascript">

    var ue = UE.getEditor('myEditor');

    //请求自己的接口上传文件
    UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
    UE.Editor.prototype.getActionUrl = function (action) {
        if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadvideo') {
            return '${ctx}/attach/uploadFile';
        } else {
            return this._bkGetActionUrl.call(this, action);
        }
    };
    $('#submit').on('click', function () {
        // 用户点击发布按钮后首先禁用按钮，避免用户重复发布
        $("#submit").attr({"disabled": "disabled"});
        var content = UE.getEditor('myEditor').getContent();
        content = content.split("\n")[0] + "</p>";
        var isContentEmpty; // 公告内容是否为空
        if (content == "" || content == "<p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</p></p>" || content == null) {
            isContentEmpty = false;
            Common.bs.alert("请填写公告内容！");
        } else {
            isContentEmpty = true;
        }
        if (isContentEmpty) {
            $.ajax({
                url: '${ctx}/announcement/add',
                type:'post',
                data: $("#announcForm").serialize(),
                success: function (result) {
                    // 保存成功后仍停留在新增界面
                    if (result.success) {  // 保存成功
                        Common.bs.alert("保存成功，请到公告列表查看！");
                    } else {  // 保存失败的话提示失败信息
                        Common.bs.alert(result.message);
                    }
                },
                error: function () {
                    Common.bs.alert('服务器错误！');
                }
            });
        }
    });
    // 控制日期控件的行为
    $(document).ready(function () {
        var start = {
            elem: '#releaseTime',
            format: 'YYYY-MM-DD',
            min: laydate.now(), //设定最小日期为当前日期
            max: '2099-06-16', //最大日期
            istime: true,
            istoday: false,
            choose: function (datas) {
                end.min = datas; //开始日选好后，重置结束日的最小日期
                end.start = datas //将结束日的初始值设定为开始日
            }
        };
        var end = {
            elem: '#useLife',
            format: 'YYYY-MM-DD',
            min: laydate.now(),
            max: '2099-06-16',
            istime: true,
            istoday: false,
            choose: function (datas) {
                start.max = datas; //结束日选好后，重置开始日的最大日期
            }
        };
        laydate(start);
        laydate(end);
    });
</script>
</body>
</html>
